import React, { Component } from 'react';
import { Provider } from 'react-redux';
import { BrowserRouter, Route } from 'react-router-dom';
// import DengesCourse from './pages/dengesCourse';
// import TutionProcess from './pages/tutionProcess';
// import PersonalTeacher from './pages/personalTeacher';
// import VolitionPlan from './pages/volitionPlan';

// import MusicScore from './pages/musicScore';

// import CourseReferral from './pages/courseReferral';
// import CourseWillPlan from './pages/courseWillPlan';
// import './App.scss';
import 'antd-mobile/dist/antd-mobile.css';
import store from './store';


import Loadable from 'react-loadable';
import LoadingComponent from './Loading';

const AsyncDengesCourse = Loadable({
  loader: () => import('./pages/dengesCourse'),
  loading: LoadingComponent
})
const AsyncTutionProcess = Loadable({
  loader: () => import('./pages/tutionProcess'),
  loading: LoadingComponent
})
const AsyncPersonalTeacher = Loadable({
  loader: () => import('./pages/personalTeacher'),
  loading: LoadingComponent
})
const AsyncVolitionPlan = Loadable({
  loader: () => import('./pages/volitionPlan'),
  loading: LoadingComponent
})
const AsyncMusicScore = Loadable({
  loader: () => import('./pages/musicScore'),
  loading: LoadingComponent
})
const AsyncScoreParticulars = Loadable({
  loader: () => import('./pages/scoreParticulars'),
  loading: LoadingComponent
})
const AsyncScoreSearch = Loadable({loader: () => import('./pages/scoreSearch'), loading: LoadingComponent})
const AsyncCourseReferral = Loadable({
  loader: () => import('./pages/courseReferral'),
  loading: LoadingComponent
})
const AsyncCourseWillPlan = Loadable({
  loader: () => import('./pages/courseWillPlan'),
  loading: LoadingComponent
})

class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <BrowserRouter>
      		<div>
      			{/*<Route path='/' exact component={Home}></Route>*/}
            <Route path='/dengesCourse' exact component={AsyncDengesCourse}></Route>
            <Route path='/tutionProcess' exact component={AsyncTutionProcess}></Route>
            <Route path='/personalTeacher' exact component={AsyncPersonalTeacher}></Route>

            <Route path='/volitionPlan' exact component={AsyncVolitionPlan}></Route>

            <Route path='/musicScore' exact component={AsyncMusicScore}></Route>
            <Route path='/scoreParticulars' exact component={AsyncScoreParticulars}></Route>
            <Route path='/scoreSearch' exact component={AsyncScoreSearch}></Route>

            <Route path='/courseReferral/:id' exact component={AsyncCourseReferral}></Route>
            <Route path='/courseWillPlan' exact component={AsyncCourseWillPlan}></Route>

      		</div>
      	</BrowserRouter>
      </Provider>
    );
  }
}

export default App;
